<template>
	<div>
		<!-- 副导航 -->
		<c-r-m-nav-cell
			ref="navcell" 
			:crm-type="crmType" 
			route-type="index"/>
	
		<div v-loading="loading" class="main-container shitu-box">
			<c-r-m-list-head
				ref="listHead" 
				:crm-type="crmType" 
				:actiontype="actiontype"
				@on-handle="listHeadHandle"/>
			<filtrate-handle-view 
				class="filtrate-bar" 
				module-type="customer" 
				:show-quit="true" 
				:showProductSelect="true"
				@load="loading=false" 
				@change="searchClick" />
			<!-- 统计 -->
			<div class="content">
				<div class="axis-content">
					<div id="axismain" />
				</div>
				<div class="table-content">
					<el-table 
						:data="list" 
						height="400" 
						stripe 
						border 
						highlight-current-row>
						<el-table-column 
							v-for="(item, index) in fieldList" 
							:key="index" 
							:prop="item.field"
							:label="item.name" 
							align="center" 
							header-align="center" 
							show-overflow-tooltip />
					</el-table>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	import base from '../mixins/base'
	import CRMNavCell from '@/components/table/new/CRMNavCell'
	import CRMListHead from '@/components/table/new/CRMListHead'
	import {
		crmLawcaseStatistics,
		crmLawcaseCourtStatistics
	} from '@/api/lawcase/lawcase'
	export default {
		mixins: [base],
		components: {
			CRMNavCell,
			CRMListHead
		},
		data() {
			return {
				crmType:"lawcase",
				actiontype:0,
				loading: false,
				tableHeight: document.documentElement.clientHeight - 210,
				postParams: {}, // 筛选参数
				list: [],
				axisList: [],
				defaultPage:0,
				fieldList: [{
						field: 'username',
						name: '员工姓名'
					},
					{
						field: 'lawcase_num',
						name: '案件总数(未结案)'
					},
					{
						field: 'susong_num',
						name: '诉讼案件(未结案)'
					},
					{
						field: 'feisu_sum',
						name: '非诉案件(未结案)'
					},
					{
						field: 'xingshi_num',
						name: '刑事案件(未结案)'
					},
					{
						field: 'close_num',
						name: '已结案'
					},
					{
						field: 'allclose_num',
						name: '已归档'
					}
				]
			}
		},
		methods: {
			searchClick(params) {
				this.postParams = params
				this.getRecordList()
			},

			/**
			 * 获取相关列表
			 */
			getRecordList(dataIndex) {
				this.list = []

				let params = {}

				if (typeof dataIndex !== 'undefined') {
					const dataItem = this.axisList[dataIndex]
					params.re_user_id = this.postParams.user_id
					params.structure_id = this.postParams.structure_id
					params.start_time = dataItem.start_time
					params.end_time = dataItem.end_time
				} else {
					params = this.postParams
				}

				this.loading = true
				let request
				
				if(this.defaultPage == 0){
					request = crmLawcaseStatistics
				}else if(this.defaultPage == 1){
					request = crmLawcaseCourtStatistics
				}
				
				request(params)
					.then(res => {
						this.loading = false
						this.list = res.data
					})
					.catch(() => {
						this.loading = false
					})
			},
			
			listHeadHandle(item){
				this.defaultPage = item
				this.list = []
				if(item == 1){
					this.fieldList =  [{
											field: 'username',
											name: '员工姓名'
										},
										{
											field: 'court_num',
											name: '开庭数'
										},
										{
											field: 'online_num',
											name: '线上开庭'
										},
										{
											field: 'outline_sum',
											name: '线下开庭'
										},
										{
											field: 'one_num',
											name: '第一次'
										},
										{
											field: 'two_num',
											name: '第二次'
										},
										{
											field: 'three_num',
											name: '第三次'
										},
										{
											field: 'four_num',
											name: '第四次'
										},
										{
											field: 'five_num',
											name: '第五次'
										}
									]
				}else if(item == 0){
					this.fieldList = [{
										field: 'username',
										name: '员工姓名'
									},
									{
										field: 'lawcase_num',
										name: '案件总数(未结案)'
									},
									{
										field: 'susong_num',
										name: '诉讼案件(未结案)'
									},
									{
										field: 'feisu_sum',
										name: '非诉案件(未结案)'
									},
									{
										field: 'xingshi_num',
										name: '刑事案件(未结案)'
									},
									{
										field: 'close_num',
										name: '已结案'
									},
									{
										field: 'allclose_num',
										name: '已归档'
									}
								]
				}
			}
		},
	}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
	.shitu-box {
		margin-top: 10px;
		padding: 10px;
		background-color: #fff;
		width: 1200px;
		font-size: 15px;
	}
	.main-container {
		border: 1px solid #e6e6e6;
		border-radius: 2px;
		background-color: white;
		height: 100%;
		overflow-y: auto;
		display: flex;
		flex-direction: column;
		// position: relative;
	}

	.filtrate-bar {
		background-color: white;
		padding: 15px 20px 5px 20px;
		margin-right: 15px;
	}

	.content {
		height: calc(100% - 54px);
		overflow-y: auto;
		padding: 10px 0;
	}

	.table-content {
		padding: 0 20px 0px 20px;
	}
</style>